This is a basic example of the Line chart that shows you how to use the pseudo-events that RGraph has:
Here the mousemove event is used to change the mouse cursor (it's automatically changed back for you). And the click event is used to show an alert.
This goes in the documents header:<script src="RGraph.common.core.js"></script> <script src="RGraph.common.dynamic.js"></script> <script src="RGraph.line.js"></script>Put this where you want the chart to show up:
<canvas id="cvs" width="1000" height="250"> [No canvas support] </canvas>This is the code that generates the chart:
<script> window.onload = function () { /** * This is the function for the mousemove event. It changes the pointer to the hand. * When the mouse is moved away from the point the pointer is changed back to what it was * automatically for you. * * @param object e The event object * @param array point The details of the point that was mouseover'ed */ function myMousemove (e, point) { return true; } /** * This is the function for the click event. * * @param object e The event object * @param array point The details of the point that was clicked */ function myClick (e, point) { alert('A point was clicked'); } var line = new RGraph.Line({ id: 'cvs', data: [12,13,16,15,16,19,19,12,23,16,13,24], options: { textAccessible: true, eventsMousemove: myMousemove, eventsClick: myClick, labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'] } }).draw(); }; </script>